html.rtl .attachment {
	direction: rtl;

	& .attachment-block {
		padding-right: 15px;
		padding-left: 0;

		& .attachment-block-border {
			right: 0;
			left: auto;
		}
	}

	& .attachment-thumb {
		padding-top: 10px;
		padding-right: 5px;
	}

	& .attachment-download-icon {
		margin-right: 5px;
		margin-left: auto;
	}
}

.attachment {
	& .attachment-block {
		position: relative;

		margin: 5px 0;
		padding-left: 15px;

		& .attachment-block-border {
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;

			width: 2px;

			border-radius: 8px;
		}
	}

	& .attachment-author {
		font-size: 0.95rem;
		font-weight: 600;
		line-height: 1.2rem;

		& > a {
			font-weight: 600;
		}

		& img {
			max-width: 16px;
			max-height: 16px;
			margin-right: 2px;
			margin-bottom: -2px;
		}

		& .time,
		& .time-link {
			font-size: 0.8em;
			font-weight: normal;
		}
	}

	& .attachment-title {

		color: #1d74f5;

		font-size: 1.02rem;
		font-weight: 500;
		line-height: 1.5rem;
	}

	& .attachment-text {
		padding: 3px 0;

		line-height: 1rem;
	}

	& .attachment-image {
		margin-top: 4px;

		line-height: 0;
	}

	& .attachment-fields {
		display: flex;

		margin-top: 4px;

		align-items: center;
		flex-wrap: wrap;

		& .attachment-field {
			flex: 1 0 100%;

			padding-top: 5px;
			padding-bottom: 5px;

			&.attachment-field-short {
				display: inline-block;

				flex: 1 1;

				margin-right: 12px;
			}

			& .attachment-field-title {
				font-weight: 600;
				line-height: 1rem;
			}
		}
	}

	& .attachment-thumb {
		padding-top: 5px;
		padding-right: 10px;

		line-height: 0;

		& img {
			max-width: 100px;
		}
	}

	& .attachment-flex {
		display: flex;
		align-items: flex-start;

		& .attachment-flex-column-grow {
			word-break: break-word;
			flex-grow: 1;
		}
	}

	& .attachment-small-content {
		max-width: 700px;
	}

	& .attachment-download-icon {
		padding: 0 5px;
	}

	& .attachment-canvas {
		display: none;
	}

	& .attachment-pdf-loading {
		display: none;

		font-size: 1.5rem;

		svg {
			animation: spin 1s linear infinite;
		}
	}

	& .actions-container {
		margin-top: 6px;
	}
}
